<html>
	<head>
		<meta charset='utf-8'>
		<title>Ajax</title>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	</head>
	<body>
		<h1>Ajax</h1>
		<script type="text/javascript">
			
				$.ajax({type: "GET",
  				url: "books.json",
  				dataType: "json",
  				success: function(books) { 
  					var o = $('<ol>');
  					$('body').append(o);
  					for(var i = 0; i < books.length; i++){
  						var book = books[i];
  						var li = $('<li>');
  						o.append(li);
  						li.append(book.title + "by: " + book.author);
  					}
  				},
  				error: function(xhr, status, e) { 
  					console.log(status, e);
  				}
				});
			
			
		</script>
	</body>
</html> 